//第一版
// var contacts = jQuery("ul.contacts");
// jQuery('<input type="search" />').insertBefore(contacts);

// var search = jQuery("input[type=search]");
// search.blur(function() {
// 	var name = search.val();
// 	contacts.find('.p-name').each(function(k, v) {
// 		var everyname = v.innerHTML;
// 		if (everyname.indexOf(name) === 0) {
// 			jQuery(v).closest(".h-card").show();
// 		}else{
// 			jQuery(v).closest(".h-card").hide();
// 		}; 
// 	});
// });

//第二版
var contacts = jQuery("ul.contacts");
jQuery('<input type="search" />').insertBefore(contacts).on("keyup",onFilter);

function onFilter(ev){
	var search = jQuery(this);
	var con = search.next();
	var name = search.val();

	var names = con.find('.p-name');
	names.each(function(k, v) {
		var filter = v.innerHTML;
		var match = filter.indexOf(name) === 0;
		var showlist = jQuery(v).closest(".h-card")
		if (match) {
			showlist.show();
		}else{
			showlist.hide();
		};
	});
}
//原版
// var contacts = jQuery("ul.contacts");     
//  jQuery('<input type="search" />').insertBefore(contacts).
// on("keyup", onFilter);     

//  function onFilter(ev) {     
//      var filterField = jQuery(this);     
//      var contacts = filterField.next();     
//      var input = filterField.val();     

//      var names = contacts.find("li .p-name");     
//      names.each(function(i, node) {     
//          var el = jQuery(node);     
//          var name = el.text();     

//          var match = name.indexOf(input) === 0;     
//          var contact = el.closest(".h-card");     
//          if(match) {
//              contact.show();    
//          } else {     
//              contact.hide();
//          }     
//     });     
//  }